<!doctype html>
<html>
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0"/>
    <meta name="format-detection" content="telephone=no,email=no,date=no,address=no">
    <title>首页</title>
    <link rel="stylesheet" type="text/css" href="./css/api.css"/>
    <link rel="stylesheet" type="text/css" href="./css/aui.css"/>
    <link rel="stylesheet" type="text/css" href="./css/common/common.css"/>
    <link rel="stylesheet" type="text/css" href="./css/bizcss/index.css"/>

</head>
<body>
<div id="wrap" class="flex-wrap flex-vertical">
    <header>
        <ul>
            <li class="border-b active" >扫码</li>
            <li class="border-b" >任务</li>
            <li class="border-b" >资料</li>
            <li class="border-b" >设置</li>
        </ul>
    </header>
    <div id="main" class="flex-con">
        <div class="aui-content aui-margin-b-15">
            <ul class="aui-list aui-media-list">
                <li class="aui-list-header">
                    尚未完成的任务
                </li>
                <li class="aui-list-item">
                    <div class="aui-media-list-item-inner">
                        <div class="aui-list-item-inner">
                            <div class="aui-list-item-title name">名称：
                              <strong><font color="#ff0000">机舱设备码</font></strong>
                            </div>
                            <div class="aui-list-item-text value">
                                发布时间：2018-07-02
                            </div>
                        </div>
                        <div class="aui-list-item-media">
                            <img src="image/qrCode.jpg">
                        </div>
                    </div>
                </li>


            </ul>
        </div>
    </div>
    <div id="footer" class="border-t">
        <ul class="flex-wrap" >
            <li tapmode="hover" onclick="randomSwitchBtn( 'html/scanning/scanning.html' );" class="flex-con active" >扫码</li>
            <li tapmode="hover" onclick="randomSwitchBtn( this );" class="flex-con" >任务</li>
            <li tapmode="hover" onclick="randomSwitchBtn( this );" class="flex-con" >资料</li>
            <li tapmode="hover" onclick="randomSwitchBtn( this );" class="flex-con" >设置</li>
        </ul>
    </div>
</div>
</body>
</html>
<script type="text/javascript" src="script/api.js"></script>
<script type="text/javascript">
    apiready = function () {
        // $api.fixStatusBar( $api.dom('header') );
        // api.setStatusBarStyle({
        //     style: 'dark',
        //     color: '#6ab494'
        // });
      //  funIniGroup();
    }

    function funIniGroup(){
        var eHeaderLis = $api.domAll('header li'),
            frames = [];
        for (var i = 0,len = eHeaderLis.length; i < len; i++) {
                frames.push( {
                    name: 'frame'+i,
                    url: './html/frame'+i+'.html',
                    bgColor : 'rgba(0,0,0,.2)',
                    bounces:true
                } )
        }
        api.openFrameGroup({
            name: 'group',
            scrollEnabled: false,
            rect: {
                x: 0,
                y: $api.dom('header').offsetHeight,
                w: api.winWidth,
                h: $api.dom('#main').offsetHeight
            },
            index: 0,
            frames: frames
        }, function (ret, err) {

        });
    }

    // 随意切换按钮
    function randomSwitchBtn( tag ) {
       console.log(tag);
       //alert(tag);
      // window.location.href=tag;
      api.openWin({
          name: 'page',
          url: tag,
          pageParam: {
              name: 'test'
          }
      });
      // funIniGroup();
      //   if( tag == $api.dom('#footer li.active') )return;
      //   var eFootLis = $api.domAll('#footer li'),
      //       eHeaderLis = $api.domAll('header li'),
      //       index = 0;
      //   for (var i = 0,len = eFootLis.length; i < len; i++) {
      //       if( tag == eFootLis[i] ){
      //           index = i;
      //       }else{
      //           $api.removeCls(eFootLis[i], 'active');
      //           $api.removeCls(eHeaderLis[i], 'active');
      //       }
      //   }
      //   $api.addCls( eFootLis[index], 'active');
      //   $api.addCls( eHeaderLis[index], 'active');
      //   api.setFrameGroupIndex({
      //       name: 'group',
      //       index: index
      //   });
     }
</script>
